<template>
  <div>
    <h2>music</h2>
    <ul>
      <li v-for="music in musicList" :key="music">
        {{ music }} {{ $route.params.time }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Music",
  computed: {
    musicList() {
      // console.log(this.musicList);
      switch (this.$route.params.id) {
        case "1":
          return ["耍把戏", "光的方向", "鲸语", "踏山河"];
        case "2":
          return [
            "You Will Know Our Names",
            "小灰の旅タ",
            "Counterattack",
            "花火が瞬く夜に",
          ];
        case "3":
          return ["启明星", "残响散歌", "死神", "ANIMA"];
        default:
          return [];
      }
    },
  },
};
</script>

<style scoped>
ul {
  list-style: none;
  margin-left: -30px;
}
</style>
